<template>
    <div id="register">
        <div class="content">
            <div class="register-box box">
                <div class="register-login clear">
                    <a :href="BASE_URL" class="login fl">
                        <img :src="logoSrc" alt="logo">
                    </a>

                    <div class="login-go fr">
                        <a :href="BASE_URL + '/index/login/index'">> 已经有账号？</a>
                        <a @click="getBlack">返回</a>
                    </div>
                </div>
                <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="ruleForm">
                    <el-form-item prop="role" label-width="0" class="role">
                        <el-checkbox-group v-model="ruleForm.role_id">
                            <el-checkbox :label="6" name="type">教师</el-checkbox>
                            <el-checkbox :label="4" name="type">学生</el-checkbox>
                            <el-checkbox :label="5" name="type">家长</el-checkbox>
                        </el-checkbox-group>
                    </el-form-item>

                    <div class="border-up-empty">
                        <span v-show="ruleForm.role_id.includes(6)"></span>
                        <span v-show="ruleForm.role_id.includes(4)"></span>
                        <span v-show="ruleForm.role_id.includes(5)"></span>
                    </div>

                     <el-form-item  prop="is_code" v-if="ruleForm.role_id.includes(4) || ruleForm.role_id.includes(6)">
                         <el-radio-group v-model="ruleForm.is_code">
                             <el-radio :label="1">有班级邀请码</el-radio>
                             <el-radio :label="0">无班级邀请码</el-radio>
                         </el-radio-group>
                     </el-form-item>

                    <template v-if="(ruleForm.role_id.includes(4) || ruleForm.role_id.includes(6)) && ruleForm.is_code === 1">
                        <!-- 邀请码 -->
                         <el-form-item class="code_"
                             v-for="(code, index) in ruleForm.codeArr"
                             :label="'邀请码' + (index === 0 ? '' : index+1)"
                             :key="code.key"
                             :prop="'codeArr.' + index + '.value'"
                             :rules="{ required: true,  validator: validateCode, trigger: 'blur'}">
                             <el-input v-model="code.value" placeholder="6位字符，区分大小写" @change="changeCode(code.value, index)" :minlength="6" :maxlength="6"></el-input>
                             <div class="code_op" v-if="ruleForm.role_id.includes(6)">
                                <i class="el-icon-circle-plus" @click="addcodeArr" v-if="is_codeArr"></i>
                                <i class="el-icon-remove" @click.prevent="removecodeArr(index)" v-if="index != 0"></i>
                             </div>
                             <div class="code_2" v-show="code.value">
                                 <ul class="class-list">
                                    <template v-for="(code, list) of relatedClass">
                                        <li :key="code.id" v-show="index == list">{{code.name }}</li>
                                    </template>
                                 </ul>
                             </div>
                        </el-form-item>
                    </template>
                    <template v-if="ruleForm.is_code === 0">
                        <!-- 班级 -->
                         <el-form-item class="class_"
                             v-for="(item, index) in ruleForm.classArr"
                             :label="'班级' + (index === 0 ? '' : index+1)"
                             :key="item.key"
                             :prop="'classArr.' + index + '.grade'"
                             :rules="[{ required: true, message: '班级不能为空',  trigger: 'change'}]">

                             <template v-if="1">
                                 <el-cascader   ref="cascader" v-show="ruleForm.role_id.includes(6)"  :props="props"  @change="handleChange($event, 6)"  :options="classArray" v-model="item.grade"  clearable></el-cascader>

                                 <el-cascader   ref="cascader" v-show="ruleForm.role_id.includes(4)"  @change="handleChange($event,0)"  :options="classArray" v-model="item.grade"  clearable></el-cascader>
                             </template>

                             <div class="code_op"  v-if="ruleForm.role_id.includes(6)">
                           </div>
                        </el-form-item>
                     </template>

                     <el-form-item label-width="0"  class="register-br" v-if="ruleForm.is_code === 1 && ruleForm.role_id.includes(6)">
                            <img src="../../../public/images/xinzhuce_05.png">
                            <span>教师负责多个班级，请点击增加按钮绑定</span>
                    </el-form-item>

                    <template v-if="ruleForm.role_id.includes(5)">
                        <el-form-item  prop="" class="children_" label-width="0" >
                            <el-tabs v-model="tabTempIndex" type="card" editable @edit="childrenTabs">
                                <el-tab-pane
                                    v-for="(item, index) in childrenUser"
                                    :label="item.childrenName != '' ? item.childrenName : item.title"
                                    :name="item.name"
                                    :key="index">
                                        <div class="catalog-cont">
                                            <el-form-item :label="`子女账号${item.name === '1' ? '' : item.name}`" :rules="{ required: true, message: '子女账号不能为空', trigger: 'change'}">
                                                <el-input v-model.trim="item.childrenName" placeholder="请输入子女账号"  maxlength="20"  :disabled="item.disabledBol"></el-input>
                                            </el-form-item>
                                            <el-form-item :label="`密码${item.name === '1' ? '' : item.name}`"
                                            :rules="{ required: true, message: '子女账号密码不能为空', trigger: 'change'}">
                                                <el-input  type="password"  v-model.trim="item.childrenPassword" placeholder="请输入子女账号密码"  maxlength="20" @change="childrenAccount(index, item.childrenName)"></el-input>
                                            </el-form-item>
                                        </div>
                                </el-tab-pane>
                            </el-tabs>
                        </el-form-item>
                         <el-form-item label-width="0"   class="register-br"></el-form-item>
                    </template>

                    <el-form-item label="用户名" prop="name">
                        <el-input v-model="ruleForm.name" minlength="1" maxlength="20"  placeholder="请填写真实姓名"></el-input>
                    </el-form-item>

                    <el-form-item label="性别" prop="sex">
                        <el-radio-group v-model="ruleForm.sex">
                            <el-radio label="1">男</el-radio>
                            <el-radio label="2">女</el-radio>
                        </el-radio-group>
                    </el-form-item>

                    <el-form-item label="任教科目" prop="subject_ids" v-if="ruleForm.role_id.includes(6)">
                        <el-select v-model="ruleForm.subject_ids" placeholder="请选择任教科目">
                            <el-option v-for="item of subjectList" :label="item.name" :value="item.id" :key="item.name"></el-option>
                        </el-select>
                    </el-form-item>

                    <el-form-item label="账号" prop="number">
                        <el-input v-model="ruleForm.number"  maxlength='16' placeholder="用于登录（建议输入学号/工号）"></el-input>
                    </el-form-item>

                    <el-form-item label="密码" prop="Tpassword">
                        <el-input type="password"  v-model.trim.native="ruleForm.Tpassword"  placeholder="密码限制8~16，由数字/大写字母/小写字母，特殊符号3种或3种以上组合组成"></el-input>
                    </el-form-item>

                    <el-form-item label="确认密码" prop="repassword">
                        <el-input type="password" v-model.trim.native="ruleForm.repassword"  placeholder="请再次输入密码"></el-input>
                    </el-form-item>

                    <el-form-item label-width="0"  class="register-br"></el-form-item>

                    <el-form-item label="手机号码" prop="telphone">
                        <el-input v-model.trim.native="ruleForm.telphone"  placeholder="输入11位手机号码" maxlength="11"></el-input>
                    </el-form-item>

                    <el-form-item label-width="0"  class="register-br">
                            <img src="../../../public/images/xinzhuce_05.png">
                            <span>非必填，可用于接收审核结果通知；需院校开通短信接口</span>
                    </el-form-item>

                    <el-form-item class="register-btn" label-width="0">
                        <el-button type="primary" @click="submitForm('ruleForm')"  v-loading="submitLoading">提交注册</el-button>
                    </el-form-item>

                    <el-form-item label-width="0"  class="register-bh">
                        <span>注册代表你已同意</span>
                        <a @click="agreementView = true">《平台用户协议》</a>
                    </el-form-item>

                </el-form>
            </div>
            <div class="register-info box">
                <p>可以同时选择教师和家长的身份</p>
                <p>其他角色、如访客、教研人员等特殊角色请联系相应平台管理员进行新增</p>
                   <img  src="../../../public/images/index.png" alt="logo">
            </div>
        </div>

        <el-dialog title="提示"
            :visible.sync="userMsgView"
            width="550px"
            custom-class="userMsgView"
            :before-close="resetForm"
            :close-on-click-modal="false">
            <div class="userMsg-tips">重要信息，用于登录，请谨记！</div>
            <div class="userMsg-info">
                <div class="userMsg-xxx">
                    <span>账号：</span><div>{{ruleForm.number}}</div>
                </div>
                <div class="userMsg-xxx">
                    <span>密码：</span><div>{{ruleForm.Tpassword}}</div>
                </div>
                <div class="userMsg-xxx" v-if="ruleForm.telphone">
                    <span>手机：</span><div>{{ruleForm.telphone}}</div>
                </div>
            </div>
            <!--  -->
             <div class="userMsg-title">角色信息</div>
             <!-- 教师 & 家长 -->
             <template v-if="ruleForm.role_id.includes(5) && ruleForm.role_id.includes(6)">
                 <div class="userMsg-info" >
                     <div class="userMsg-xxx">
                         <span>角色：</span><div>家长</div>
                     </div>
                    <div class="userMsg-xxx">
                         <span>子女：</span>
                         <div>
                            <span v-for="(item, index) of childrenUser" :key="index">{{item.childrenName}}</span>
                       </div>
                     </div>
                     <div class="userMsg-xxx">
                          <span>子女班级：</span>
                          <div>
                               <span v-for="(item, index) of childrenUser" :key="index">{{item.rename}}</span>
                          </div>
                      </div>
                 </div>
                 <div class="userMsg-info">
                     <div class="userMsg-xxx">
                         <span>角色：</span><div>教师</div>
                     </div>
                     <div class="userMsg-xxx" >
                          <span>班级：</span>
                          <div>
                                <span v-for="(item, index) of relatedClass" :key="index">{{item.rename}}</span>
                          </div>
                      </div>
                    <div class="userMsg-xxx">
                         <span>任教科目：</span>
                         <div v-if="subjectList.length !== 0">
                           <template v-for="item of subjectList">
                               <span :key="item.id" v-if="item.id === ruleForm.subject_ids">{{item.name}}</span>
                           </template>
                       </div>
                     </div>
                 </div>
            </template>
            <!-- 通用 -->
            <template v-else>
                <div class="userMsg-info">
                    <div class="userMsg-xxx">
                        <span>角色：</span>
                        <template v-if="ruleForm.role_id[0] === 6"><div>教师</div></template>
                        <template v-if="ruleForm.role_id[0] === 5"><div>家长</div></template>
                        <template v-if="ruleForm.role_id[0] === 4"><div>学生</div></template>
                    </div>

                    <div class="userMsg-xxx">
                        <span>性别：</span>
                        <div>{{ruleForm.sex == 1 ? '男' : '女'}}</div>
                    </div>

                   <div class="userMsg-xxx" v-if="relatedClass.length !== 0 && ruleForm.role_id != 5">
                        <span>班级：</span>
                        <div>
                            <span v-for="(item, index) of relatedClass" :key="index">{{item.rename}}</span>
                        </div>
                    </div>

                    <template v-if="ruleForm.role_id.includes(5)">
                        <div class="userMsg-xxx">
                             <span>子女：</span>
                             <div>
                                 <span v-for="(item, index) of childrenUser" :key="index">{{item.childrenName}}</span>
                             </div>
                         </div>
                         <div class="userMsg-xxx">
                              <span>子女班级：</span>
                              <div>
                                  <span v-for="(item, index) of childrenUser" :key="index">{{item.rename}}</span>
                              </div>
                          </div>
                    </template>

                    <div class="userMsg-xxx" v-if="ruleForm.role_id.includes(6)">
                         <span>任教科目：</span>
                         <div v-if="subjectList.length !== 0">
                            <template v-for="item of subjectList">
                                <span :key="item.id" v-if="item.id === ruleForm.subject_ids">{{item.name}}</span>
                            </template>
                         </div>
                     </div>
                </div>
            </template>

            <div class="userMsg-btn">
                <el-button type="primary" plain @click="resetForm('ruleForm')">取消</el-button>
                <el-button type="primary" @click="submissionRegistration">确定无误，提交注册</el-button>
            </div>

        </el-dialog>

        <el-dialog title="平台用户协议"
            top="3vh"
            :visible.sync="agreementView"
            width="80%"
            custom-class="agreementView"
            :close-on-click-modal="false">
            <div class="">
                <agreementVue :platformName="logoTxt"></agreementVue>
            </div>
        </el-dialog>
    </div>
</template>

<script>
    import agreementVue from './agreement'
    export default {
        components: {agreementVue},
        data() {
            return {
                props: { multiple: true },
                ruleForm: {
                    name: '',
                    number: '',
                    Tpassword: '', // 密码
                    repassword: '', // 确认密码
                    role_id: [6],
                    class_ids: '', // 班级id
                    subject_ids: '',
                    children_ids: '', // 孩子账号id
                    telphone: '',
                    school_id: '',
                    app_code: sessionStorage.getItem('CheckSchoolAppCode'),
                    sex: '', // 男 1 , 女 2
                    is_code: 1,
                    codeArr: [ { value: ''}],
                    classArr: [ { grade: '',class: '',} ],
                },
                agreementView: false,
                logoUrl: sessionStorage.getItem('logoUrl'),
                logoTxt: sessionStorage.getItem('siteTitle'),
                logoSrc: '',
                allGradeList: [],
                subjectList: [],
                tabTempIndex: '1',
                childrenUser: [
                    {
                        title: '子女',
                        name: '1',
                        childrenName: '',
                        childrenPassword: '',
                        disabledBol: false
                    }
                ],
                submitLoading:false,
                userMsgView: false,
                accountClass: [],
                relatedClass: [],
                is_codeArr: true,
                is_classArr: true,
                classArray: [],
                checkFlag: false,
                rules: {
                    role_id: [
                       { required: true, message: '请选择角色', trigger: 'change' }
                    ],
                    is_code: [
                        { required: true, message: '请至少选择一个', trigger: 'change' }
                    ],
                    name: [{ required: true, validator: this.validateUser, trigger: "blur" }],
                    sex: [
                        { required: true, message: '请选择性别', trigger: 'change' }
                    ],
                    number: [
                        {pattern: this.rules.account.reg, message: this.rules.account.msg, trigger: 'blur'},
                        { required: true, message: '请输入登录账号', trigger: 'blur'}
                    ],
                    Tpassword: [
                        { required: true, pattern: this.rules.strongPwd.reg, message: this.rules.strongPwd.msg, trigger: 'blur'},
                        { validator: this.validatePass, trigger: 'blur'  }
                    ],
                    repassword: [
                        { required: true, pattern: this.rules.strongPwd.reg, message: this.rules.strongPwd.msg, trigger: 'blur'},
                        { validator: this.validateCheckPass, trigger: 'blur'  }
                    ],
                    telphone: [
                        {  pattern: this.rules.mobile.reg, message: this.rules.mobile.msg, trigger: 'blur' },
                    ]
                },
            }
        },
        watch: {
            "ruleForm.role_id"(newVal, oldVal){
                 if ( newVal.length > 1 && newVal[newVal.length - 1] === 4) {
                    this.ruleForm.role_id = [4];
                    this.ruleForm.codeArr = [ { value: ''}];

                 }else if ( newVal.length > 1 &&  newVal[0] === 4) {
                    this.ruleForm.role_id = [];
                    this.ruleForm.role_id.push(newVal[1]);
                    this.ruleForm.codeArr = [ { value: ''}];

                }else if(newVal[0] === 5) {

                }
            },
            'ruleForm.codeArr'(newVal, oldVal){
                newVal.length >= 5 ? this.is_codeArr = false : this.is_codeArr = true
            },
            'ruleForm.classArr'(newVal, oldVal){
                newVal.length >= 5 ? this.is_classArr = false : this.is_classArr = true
            },
        },

        created(){
            this.TeachSubjects()
            this.allGrade()
            this.classOrg()
            this.getLogo()
        },
        methods: {
            getBlack(){
                this.$router.back(-1)
            },
            /**
             * 验证重复元素，有重复返回true；否则返回false
             * @DateTime 2020-05-26T15:25:17+0800
             * @qiu_m
             * @param    {[type]}                 arr [description]
             * @return   {Boolean}                    [description]
             */
            isRepeat(arr) {
                var hash = {};
                for(var i in arr) {
                    if(hash[arr[i]]) {
                        return true;
                    }
                    hash[arr[i]] = true;
                }
                return false;
            },
            isChineseChar(str){
               var reg = /[\u4E00-\u9FA5\uF900-\uFA2D]/;
               return reg.test(str);
            },
            validateCode(rule, value, callback) { /*校验邀请码输入内容是否为空 */
                if (is_empty(value)) {
                    return callback(new Error('邀请码不能为空'));
                }else if(this.isChineseChar(value)){
                     return callback(new Error('不能否含有中文，由6位字母數字组成，区分大小写'));

                } else {
                    callback()
                }
            },
            validateUser(rule, value, callback){ /*校验用户名 */
                if(value.trim()===''){
                    return callback(new Error('用户名不能为空'));
                }else{
                    callback()
                }
            },
            /**
             * 密码验证
             * @DateTime 2020-05-26T14:44:38+0800
             * @qiu_m
             * @param    {[type]}                 rule     [description]
             * @param    {[type]}                 value    [description]
             * @param    {Function}               callback [description]
             * @return   {[type]}                          [description]
             */
            validatePass(rule, value, callback) {
                if (this.ruleForm.repassword) {
                    this.$refs.ruleForm.validateField('repassword');
                }
                callback();
            },
            validateCheckPass(rule, value, callback) {
                if ((value || this.ruleForm.Tpassword) && (value !== this.ruleForm.Tpassword)) {
                    callback(new Error('两次输入密码不一致!'));
                } else {
                    callback();
                }
            },

            /**
             * 获取前台logo
             * @DateTime 2020-06-03T11:33:33+0800
             * @qiu_m
             * @return   {[type]}                 [description]
             */
            getLogo(){
                let success = (res=>{
                    let data = res.data[0]
                    this.logoSrc = this.BASE_URL + data.f_logo
                })
                let params =  {}
                this.$ajax.get('api/system/get_logo',{ params,func: {success: success}})
            },
            //邀請碼---請求獲取關聯班級
            changeCode(val, index){
                if (val.trim() == '') {}

                let flag = 0;
                for (let i = 0; i < this.ruleForm.codeArr.length; i++) {
                    if (this.ruleForm.codeArr[i].value === val) {
                        if (flag === 0) {
                            flag++;
                        } else {
                            flag = 0;
                            this.ruleForm.codeArr[i].value = '';
                            return this.$message.error('邀请码不能重复使用')
                        }
                    }
                }

                let success = (res =>{
                    if (res.data.length !== 0) {
                        this.$message.success(res.msg)
                        res.data[0].rename = res.data[0].name
                        this.relatedClass.push(res.data[0])

                        if(this.ruleForm.codeArr.length == 1){
                             this.relatedClass = []
                            this.relatedClass.push(res.data[0])
                        }else{
                            this.relatedClass.splice(index, 1, res.data[0])
                        }

                    }else{
                        this.$message.error("请输入正确的邀请码")
                        this.ruleForm.codeArr[index].value = ''
                        this.relatedClass.splice(index, 1)
                        return
                    }
                });
                this.$ajax({
                    url: 'api/org/get_class_by_password',
                    method: 'get',
                    params: {
                        level: 4,
                        direction: 'balance',
                        password: val
                    },
                    func: {success: success}
                })
            },
            // 邀请码
            addcodeArr() {
                 this.ruleForm.codeArr.push({
                   value: '',
                   key: Date.now()
               });
            },
            removecodeArr(index) {
                if (index !== -1) {
                   this.ruleForm.codeArr.splice(index, 1)
                   this.relatedClass.splice(index, 1)
                }
            },
            handleChange(value, role) {
                let temp  = [];

                if (role == 6) {
                    temp = value.map(item => item[2])

                }else{
                    temp.push(value[2])
                }

                this.classCodeArr = temp;
            },
            // 任教科目
            TeachSubjects(){

                let success = (res =>{
                    this.subjectList = res.data;
                });
                this.$ajax({
                    url: 'api/cate/simple_subject',
                    methed: 'get',
                    params:{},
                    func:{success: success}
                })
            },
            /*  获取所有年级*/
            allGrade(){
                let success = (res=>{
                    this.allGradeList = res.data;
                });

                this.$ajax({
                    url: 'api/org/all_grade',
                    method: 'get',
                    params: {},
                    func: {success: success}
                })
            },
            /*
                无班级邀请码的班级
             */
            classOrg(){

                this.classArray = []
                let success = (res =>{

                    this.classArray = res.data[0].children
                    for (let i = 0; i < this.classArray.length; i++) {
                        this.classArray[i].label  =   this.classArray[i].name
                        this.classArray[i].value  =   this.classArray[i].id

                        for (let j = 0; j <  this.classArray[i].children.length; j++) {

                              this.classArray[i].children[j].label = this.classArray[i].children[j].name;
                              this.classArray[i].children[j].value = this.classArray[i].children[j].id

                              if (this.classArray[i].children[j].children.length) {
                                for (let k = 0; k < this.classArray[i].children[j].children.length; k++) {
                                    this.classArray[i].children[j].children[k].label = this.classArray[i].children[j].children[k].name
                                    this.classArray[i].children[j].children[k].value = this.classArray[i].children[j].children[k].id
                                    delete this.classArray[i].children[j].children[k].children
                                }
                              }
                        }
                    }

                });
                this.$ajax({
                    url: 'api/org/org',
                    methed: 'get',
                    params:{
                        data_type: 'manage_tree',
                        status: [1,2]
                    },
                    func:{success: success}
                })
            },
            //子女账号
            childrenTabs(targetName, action) {

                if (action === 'add') {
                    let newTabIndex = this.childrenUser.length + 1;
                    this.tabTempIndex = (newTabIndex).toString();
                    if (newTabIndex > 5) {
                        this.$message.warning('不能超过5个哦~~');
                        this.tabTempIndex = '5'
                        return
                    }
                    this.childrenUser.push({
                        title: `子女${newTabIndex}`,
                        name: (newTabIndex).toString(),
                        childrenName: '',
                        childrenPassword: '',
                        disabledBol: false
                    })
                }
                if (action === 'remove') {
                    if (this.childrenUser.length ===1) {
                        this.$message.error('子女账号不能为空');
                        return
                    }
                    this.checkFlag=true;
                    var tabs = deep_clone( this.childrenUser );
                    var newtabs =  [];
                    var continue_ornot = false;
                    var ivn = 0;

                    for (var i = 0; i <  tabs.length; i++) {

                        if( parseInt(tabs[i].name) === parseInt(targetName)){
                            continue_ornot = true;
                            if( parseInt( this.tabTempIndex ) > 1 && i === parseInt( this.tabTempIndex ) ){
                                this.tabTempIndex = (parseInt( this.tabTempIndex )).toString()

                            }else if( parseInt( this.tabTempIndex ) > i ){
                                this.tabTempIndex = (parseInt( this.tabTempIndex) -1).toString()
                            }
                            continue;
                        }else{
                            ivn = ivn+1;
                            if( continue_ornot ){
                                tabs[i].title = `子女-${ivn}`;
                                tabs[i].name = (ivn).toString();
                            }
                            newtabs.push( tabs[i] );
                        }
                    }
                    this.childrenUser = deep_clone( newtabs );
                }
            },
            //子女账户
            childrenAccount(index, name){
                this.checkFlag=false;
                let childrenName = this.childrenUser.map(item=>item.childrenName).filter(Boolean)
                if ( this.isRepeat(childrenName)) {
                    this.childrenUser[index].title =  '子女' + (index+1);
                    this.childrenUser[index].childrenPassword = ''
                    this.childrenUser[index].disabledBol = false;
                    this.checkFlag=false;
                    this.$message.error('不可重复绑定账号')
                }

                let success = (res=>{
                    this.checkFlag=true;
                    if (Object.keys(res.data).length !== 0) {
                        this.$message.success(res.msg);
                        this.childrenUser[index].disabledBol = true;
                        this.childrenUser[index].id = res.data.id;
                        this.childrenUser[index].class_id = res.data.class_id;
                        this.childrenUser[index].rename = res.data.class_name;
                    }else {
                        this.childrenUser[index].title =  '子女' + (index+1);
                        this.childrenUser[index].childrenPassword = ''
                        this.childrenUser[index].disabledBol = false;
                    }
                })

                let fail = (res=>{
                    this.$message.error(res.msg)
                    this.childrenUser[index].title =  '子女' + (index+1)
                    this.childrenUser[index].childrenPassword = ''
                    this.childrenUser[index].disabledBol = false
                    this.checkFlag=false;
                })
                this.$ajax({
                    url: 'api/user/check_user',
                    method: 'get',
                    params: {
                        number: this.childrenUser[index].childrenName,
                        password: this.childrenUser[index].childrenPassword
                    },
                    func: {success, fail}
                })
            },
            submitForm(formName) {

                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        this.submitLoading=true;
                        setTimeout(()=>{
                            this.submitLoading=false;
                            if(this.ruleForm.role_id.includes(5)&&!this.checkFlag){
                                return;
                            }
                            this.showDialog(formName);
                        },1000)
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            // 显示提交注册弹窗
            showDialog(){
                // 勾选了家长身份
                if(this.ruleForm.is_code == 0){
                    let arrID = []
                    this.classArray.forEach((item)=>{
                        item.children.forEach((child)=>{
                            child.children.forEach((list)=>{
                                if (this.classCodeArr.includes(list.id)) {
                                    arrID.push(list)
                                }
                            })
                        })
                    })
                    this.relatedClass = arrID
                }
                this.userMsgView = true
            },
            resetForm(formName) {
                if (this.ruleForm.is_code == 1) {
                    this.accountClass = []
                }
                this.userMsgView = false
            },
            submissionRegistration() {

                let class_id = [] // 班级
                for (var i = 0; i < this.relatedClass.length; i++) {
                    class_id.push(this.relatedClass[i].id)
                }

                let children_ids = [] // 孩子
                for (var i = 0; i < this.childrenUser.length; i++) {
                    children_ids.push(this.childrenUser[i].id)
                }

                let params = {
                    name: this.ruleForm.name,
                    number: this.ruleForm.number,
                    Tpassword: this.ruleForm.Tpassword,
                    repassword: this.ruleForm.repassword,
                    role_id: this.ruleForm.role_id.join(),
                    class_ids: class_id.join(),
                    subject_ids: this.ruleForm.subject_ids,
                    children_ids: children_ids.join(),
                    telphone: this.ruleForm.telphone,
                    school_id: this.ruleForm.school_id,
                    app_code: this.ruleForm.app_code,
                    sex: this.ruleForm.sex
                }

                let success = res =>{
                    this.$message.success(res.msg + '请等待管理员审核~')
                    this.userMsgView = false

                    this.relatedClass = []
                    this.ruleForm = {
                        name: '',
                        number: '',
                        Tpassword: '', // 密码
                        repassword: '', // 确认密码
                        role_id: [6],
                        class_ids: '', // 班级id
                        subject_ids: '',
                        children_ids: '', // 孩子账号id
                        telphone: '',
                        school_id: '',
                        app_code: sessionStorage.getItem('CheckSchoolAppCode'),
                        sex: '', // 男 1 , 女 2
                        is_code: 1,
                        codeArr: [ { value: ''}],
                        classArr: [ { grade: '',class: '',} ],
                    }
                    this.childrenUser = [
                        {
                            title: '子女',
                            name: '1',
                            childrenName: '',
                            childrenPassword: ''
                        }
                    ];
                    location.href = this.BASE_URL
                }

                this.$ajax({ url: 'api/user/user_apply', method: 'post', data: params, func: {success}})
            }
       }
    }
</script>

<style lang="scss">
@import '../../assets/css/register.scss';
.el-form-item__error {
    width:500px
}
</style>
